<!-- 标题 -->
<template>
  <div class="container" :style="'background-image:url('+ arr[text].url +')'">
    <div class="title">
      <img :src="arr[text].src" alt="">
      {{arr[text].title}}
    </div>
    
  </div>
</template>

<script>
import lv from '../../assets/lv.png'
import lan from '../../assets/lan.png'
import hong from '../../assets/hong.png'
import title0 from '../../assets/title0.png'
import title1 from '../../assets/title1.png'
import title2 from '../../assets/title2.png'
import title3 from '../../assets/title3.png'
import title4 from '../../assets/title4.png'
import title5 from '../../assets/title5.png'
export default {
  props:["text"],
  data() {
    return {
        arr:[
          {src: title0,title:'我的信息',url:lv},
          {src: title1,title:'我的组织',url:lan},
          {src: title2,title:'我的画像',url:hong},
          {src: title3,title:'我的待办',url:lv},
          {src: title4,title:'党建智搜',url:lan},
          {src: title5,title:'党建驾驶舱',url:hong}
        ]
      };
  },
}
</script>
<style scoped>
.title{
  height: 33px;
  display: flex;
  align-items: center;
}
.container img{
  margin: 0 5px 0 16px;
  width: 17px;
  height: 17px;
}
.container{
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  height: 60px;
  font-size: 2.7rem;
  color: #FFFFFF;
}
</style>